<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<%
request.setCharacterEncoding( "UTF-8" );
response.setCharacterEncoding( "UTF-8" );
response.setContentType( "text/html; charset=UTF-8" );
%>

<style type="text/css">
#top_logo {
	text-align: center;
	font-size: 26pt;
	height: 120px;
	color: #333333;
	cursor: pointer;
	font-weight: bold;
	padding-top: 10px;
}

#top_menu {
	position: relative;
	padding-top:15px;
	padding-bottom: 15px;
	background:#202226;
	text-align:center;
	font-size:11pt;
	z-index: 30;
}

#top_menu span {
	color: #cccccc;
	padding-top:15px;
	padding-bottom: 15px;
	padding-left: 10px;
	padding-right: 10px;
	cursor: pointer;
	font-size: 13pt;
	font-weight: bold;
}

#top_menu div {
	display: none;
}

</style>

<script type="text/javascript">
var childMenu;

$(function() {
	$("#top_menu a")
		.css("font-size", "11pt")
		.css("color", "#eeeeee")
		.css("font-weight", "bold");
	
	//하위 메뉴 생성.
	topMenuInitialize();
	
	$("#top_menu span").hover(
		function() {
			fadeOut(childMenu);
			
			$(this).css("background", "#fce000").css("color", "#333333");
			var id = $(this).html();
			id = removeSpecialChars(id);
			childMenu = $("#" + id);
			
			var position = $(this).offset();
			$(childMenu).css("left", position.left).css("top", position.top);
			$(childMenu).show("fade", 150);
		},
		
		function() {
			$(childMenu).hover(
				function() {},
				function() {
					fadeOut(childMenu);
				}
			);
			$("#top_logo").hover(
				function() {
					fadeOut(childMenu);
				}
			);
		}
	);
});

function fadeOut(childMenu) {
	$("#top_menu span").css("background", "#202226").css("color", "#cccccc");
	$(childMenu).hide("fade", 150);
}

function topMenuInitialize() {
	var topMenus = $("#top_menu span");
	for(var i = 0; i < topMenus.length; i++) {
		$(topMenus[i]).attr("id", "this");
		
		childMenu = $("<div/>", {
			html: $("#this + div").html()
		});
		
		var id = $(topMenus[i]).html();
		id = removeSpecialChars(id);
		var position = $(topMenus[i]).offset();
		$(childMenu)
			.css("position", "absolute")
			.css("margin-top", 50)
			.css("padding-top", 30)
			.css("padding-left", 44)
			.css("padding-right", 44)
			.css("padding-bottom", 20)
			.css("z-index", 10)
			.css("background", "#202226")
			.css("box-sizing", "border-box")
			.css("-moz-box-sizing", "border-box")
			.css("-webkit-box-sizing", "border-box")
			.css("border-top", "4px solid #fce000")
			.css("border-bottom", "8px solid #fce000")
			.css("color", "#eeeeee")
			.css("display", "none")
			.attr("id", id);
		
		$("body").append(childMenu);
		$(childMenu).css("left", position.left)
			.css("top", position.top);
		
		$(topMenus[i]).removeAttr("id");
	}
}

function removeSpecialChars(str) {
	var specialChars = /[ ~!#$^&*=+|:;?"<,.>']/;
	return str.split(specialChars).join("");
}

</script>

</head>

<body>

<div id="top_logo" align="center" onclick="location.href='login.ga'">
	<img src="resources/images/header_logo.gif"/>Administrator
</div>
<div id="top_menu" align="center">
	<span onclick="location.href='gamesList.ga'">게임 관리</span>
		<div>
			<a href="gamesList.ga">게임 현황</a><p/>
			<a href="regGamesForm.ga">게임 등록</a>
		</div>
		
	<span onclick="location.href='advList.ga'">광고주</span>
		<div>
			<a href="advList.ga">광고주 현황</a><p/>
			<a href="regAdvForm.ga">광고주 등록</a><p/>
			<a href="advOutForm.ga">광고주 탈퇴</a><p/>
		</div>
	
	<span onclick="location.href='giftCard.ga'">모바일 상품권</span>
		<div>
			<a href="giftCard.ga">모바일 상품권 현황</a><p/>
			<a href="regGiftCardForm.ga">모바일 상품권 등록</a>
		</div>
	
	<span onclick="location.href='contentsList.ga'">광고 등록</span>
		<div>
			<a href="contentsList.ga">컨텐츠 관리</a><p/>
			<a href="getGgong.ga">꽁 모으기</a><p/>
			<a href="specialGame.ga">경품 게임</a>
		</div>
	
	<span onclick="location.href='loginReport.ga'">리포트</span>
		<div>
			<a href="loginReport.ga">접속자 현황</a><p/>
			<a href="pvReport.ga">앱 노출 현황</a><p/>
			<a href="tempDayReportForm.ga">임시 리포트</a>
		</div>
	
	<span onclick="location.href='eventList.ga'">이벤트</span>
		<div>
			<a href="eventList.ga">이벤트 목록</a><p/>
			<a href="regEventForm.ga">이벤트 등록</a>
		</div>
	
	<span onclick="location.href='inputInvoiceNum.ga'">배송 관리</span>
		<div>
			<a href="inputInvoiceNum.ga">송장번호 입력</a>
		</div>
	
	<span onclick="location.href='userRegReport.ga'">회원 관리</span>
		<div>
			<a href="userRegReport.ga">회원 현황</a><p/>
			<a href="userSearch.ga">회원 검색</a>
		</div>
	
	<span onclick="location.href='gcm.ga'">푸시 알림</span>
		<div>
			<a href="gcm.ga">푸시 보내기</a>
		</div>
	
	<span onclick="location.href='noticeList.ga'">공지 사항</span>
		<div>
			<a href="noticeList.ga">공지 사항 목록</a><p/>
			<a href="regNoticeForm.ga">공지 사항 등록</a>
		</div>
	
	<span onclick="location.href='termsList.ga'">약관 관리</span>
		<div>
			<a href="termsList.ga">약관 목록</a><p/>
			<a href="regTermsForm.ga">약관 등록</a>
		</div>
	
	<span onclick="location.href='policyList.ga'">운영 정책</span>
		<div>
			<a href="policyList.ga">운영 정책 목록</a><p/>
			<a href="regPolicyForm.ga">운영 정책 등록</a>
		</div>
	
	<span onclick="location.href='setServerForm.ga'">서버 관리</span>
		<div>
			<a href="setServerForm.ga">서버 설정</a>
		</div>
	
	<span onclick="location.href='askList.ga'">1:1 문의하기</span>
		<div>
			<a href="askList.ga">유저 문의 리스트</a>
		</div>
	
</div>

</body>
</html>